<template>


  <el-row :gutter="20">
    <el-col :span="6"><span> 姓名:</span></el-col>
    <el-col :span="18"> <el-input v-model="input" placeholder="请输入名字" /></el-col>
  </el-row>


  <el-row>
    <el-col :span="6">
      <span> 性别:</span>
    </el-col>
    <el-col :span="18"> <el-radio-group v-model="gender" class="ml-4">
        <el-radio value="1" size="large">男</el-radio>
        <el-radio value="2" size="large">女</el-radio>
      </el-radio-group>
    </el-col>
  </el-row>


  <el-row>
    <el-col :span="6">
      <span> 爱好：</span>
    </el-col>
    <el-col :span="18">
      <el-radio-group v-model="likeList" class="ml-4">
        <el-checkbox label="吃" value="吃" />
        <el-checkbox label="喝" value="喝" />
        <el-checkbox label="玩" value="玩" />
        <el-checkbox label="乐" value="乐" />
      </el-radio-group>
    </el-col>
  </el-row>



  <el-row>
    <el-col :span="6">
      <span> 我的口号是：</span>
    </el-col>
    <el-col :span="18">
     
        <el-input  v-model="mycall" type="texttare" placeholder="请输入我的口号" />

    </el-col>
  </el-row>


  
  <el-row>
    <el-col :span="6">
    </el-col>
    <el-col :span="18">
      <el-button type="primary" @click="sumbit">提交</el-button>

    </el-col>
  </el-row>


</template>

<script lang="ts" setup>
import { ref } from 'vue'
const input = ref('')

const gender = ref('1')

const likeList = ref([])

const mycall = ref('')

const sumbit=()=>{
  alert('我是${name.value},${gender.value},我喜欢${likeList.value},我的口号是${my.value}')
}

</script>